<!--tvm票款差异协查-->
<template>
  <div class="huLianWangShouPiaojiDataInput EditorOrAdd el-card is-always-shadow el-card__body">
    <el-dialog
      title="互联网售票机数据编辑操作"
      :visible.sync="dialogVisible"
      @close="closed"
      width="950px">
      <avue-form v-if="isReload" class="huLianWangShouPiaojiDataInputForm" :option="option" v-model="formData" @submit="handleSubmit">
        <template slot-scope="scope" slot="lineCode">
          <el-select v-model="formData.lineCode" placeholder="请选择" style="width: 150px" clearable @change="changeLine" :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in lineCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="stationCode">
          <el-select v-model="formData.stationCode" placeholder="请选择" style="width: 150px" :disabled="showType==3" @change="changeStation" filterable>
            <el-option
              v-for="(item,index) in stationCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>

        <!-- slot卡槽的名字为prop+Search，对应下面option的column里面的prop -->
        <template slot-scope="scope" slot="equipmentCode">
          <el-select v-model="formData.equipmentCode" placeholder="请选择" style="width: 150px" :disabled="showType==3" @change="getSheBei" filterable>
            <el-option
              v-for="(item,index) in equipmentNumbers"
              :key="index"
              :label="item.equipmentCode"
              :value="item.equipmentCode">
            </el-option>
          </el-select>
        </template>

        <!-- <template slot-scope="{row}" slot="listoption1">
          <avue-crud ref="listoption1" :option="listoption1" :data="formData.dynamic" @selection-change="(list)=>{selectedKeys=[];list.forEach(function(v,index) {
            selectedKeys.push(v.$index);
          })}">
            <template slot-scope="{row}" slot="equipmentCode">
              <el-select v-model="row.equipmentCode" placeholder="请选择" style="width: 150px" :disabled="showType==3" @change="(v)=>{row.equipmentCode=v.operationCode;row.equipmentId=v.id}">
                <el-option
                  v-for="(item,index) in operationCodes"
                  :key="index"
                  :label="item.operationCode"
                  :value="item">
                </el-option>
              </el-select>
            </template>

            <template slot-scope="{row}" slot="totalSaleAmount" >
              <span>{{row.totalSaleAmount= jisuanPrice(row)}}</span>
            </template>
            <template slot-scope="scope" slot="menuRight">
              <el-button type="primary" size="mini" @click="add()">新增</el-button>
              <el-button type="danger" size="mini" @click="del()">删除</el-button>
            </template>
          </avue-crud>
        </template> -->



        <template slot-scope="scope" slot="menuForm">
          <el-button type="primary" @click="closed">返回</el-button>
        </template>
      </avue-form>
    </el-dialog>
  </div>
</template>


<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import {listoption1} from "./Add.js";
  import {
    fenExYuangettoFixed,
    getgetStationCodes,
    getLineCodes,
    getSwPmDeviceOperationCodeList,
    getSwPmInternetTicketEquipmentCodeList,
    qianxiangType
  } from "../../../../../../api/subwayRat/commonCheck";
  import {mondifySwAuInputInternetTicketEquipmentDetail} from "../../../../../../api/subwayRat/TVMRevenueVarianceAudit.TvmChaYiDXC/huLianWangShoupiaoji/huLianWangShouPiaojiXianWang";

  export default {
    components:{
    },
    data() {
      return {
        isReload:true,
        //1编辑，2添加，3预览
        showType:1,
        dialogVisible:true,
        lineCodes:[],
        listoption1:listoption1,
        selectedKeys:[],
        stationCodes:[],
        operationCodes:[],
        equipmentNumbers:[],
        formData:{
          dynamic: []
        },
        option:{
        }
    }
    },
    created() {
    },
    methods: {
      add(){
        this.formData.dynamic.push({$cellEdit:true})
      },
      del(){
        for(let i=0;i<this.selectedKeys.length;i++){
          this.formData.dynamic.splice(this.selectedKeys[i],1);
        }
      },
      async handleSubmit(form,done){
        let param={};
        param.details=JSON.stringify(this.formData.dynamic);
        param.details=this.formatterAmount(param.details,false);
        param.lineCode=this.formData.lineCode;
        param.stationCode=this.formData.stationCode;
        param.revenueDate=this.formData.revenueDate;
        param.equipmentCode=this.formData.equipmentCode;
        param.compareTotalNumberSales=this.formData.compareTotalNumberSales;
        param.compareSubtotalTotal=Number(this.formData.compareSubtotalTotal)*100;
        await mondifySwAuInputInternetTicketEquipmentDetail(param).then(res=>{
          if(res.data.code==0){
            this.$message.success("操作成功！");
            this.closed();
            this.$parent.getList();
          }else{
            this.$message.error("操作失败！");
          }
        }).catch((e)=>{
          this.$message.error("操作失败！");
        });
        done();
      },
      formatterAmount(rows,isYuan){ //格式化日期
        rows=JSON.parse(rows);
        if(isYuan){
          for(let i=0;i<rows.length;i++){
            let row=rows[i];
            row.unitPrice=fenExYuangettoFixed(row,'unitPrice');
            row.totalSaleAmount=fenExYuangettoFixed(row,'totalSaleAmount');
          }
        }else if(!isYuan){
          for(let i=0;i<rows.length;i++){
            let row=rows[i];
            row.unitPrice=Number(row.unitPrice)*100;
            row.totalSaleAmount=Number(row.totalSaleAmount)*100;
          }
        }
        return JSON.stringify(rows);
      },
      jisuanPrice(row){ //计算结果
        let res=(row.unitPrice?row.unitPrice:0)*(row.saleNumber?row.saleNumber:0);
        let saleNumberTotal=0;
        let priceTotal=0;
        for(let i=0;i<this.formData.dynamic.length;i++){
          let saleNumber=(this.formData.dynamic[i].saleNumber)?this.formData.dynamic[i].saleNumber:0;
          let unitPrice=(this.formData.dynamic[i].unitPrice)?this.formData.dynamic[i].unitPrice:0;
          let totalSaleAmount=saleNumber*unitPrice;
          saleNumberTotal+=saleNumber;
          priceTotal+=totalSaleAmount;
        }
        this.formData.totalNumberSales=saleNumberTotal;
        this.formData.subtotalTotal=priceTotal.toFixed(2);;
        return res.toFixed(2);//结果保留两位
      },
      recallShow(id,row,showType){
        this.showType=showType;
        Object.assign(this.formData,row);
        this.getOption();
      },
      closed(){
        this.dialogVisible=false;
        this.$parent.isShowDia=false;
      },
      getOption(){
        let th=this;
        this.option={
          submitBtn:this.showType!=3,
          emptyBtn:false,
          group:[
            {
              icon:'',
              label: '',
              // collapse:false,
              prop: 'group1',
              column: [{
                label: '线路',
                prop: 'lineCode',
                type: 'select',
                labelWidth:130,
                formslot:true,
              },{
                label: '站点',
                prop: 'stationCode',
                type: 'select',
                // width:250,
                labelWidth:130,
                formslot:true,
              },{
                label: '设备编号',
                prop: 'equipmentCode',
                type: 'select',
                labelWidth:130,
                formslot:true,
              },{
                label: '发售数量(合计)',
                prop: 'compareTotalNumberSales',
                // width:'250',
                labelWidth:130,
                type:'number',
                //disabled: true
              },{
                label: '小计金额(合计)',
                prop: 'compareSubtotalTotal',
                // width:'250',
                labelWidth:130,
                type:'number',
                precision:2,
                //disabled: true
              },{
                label: '日期',
                prop: 'revenueDate',
                valueFormat: 'yyyy-MM-dd',
                // width:'250',
                labelWidth:130,
                type:'date',
                pickerOptions:{
                  disabledDate(time) {
                    return time.getTime() > Date.now();
                  }},
                disabled: this.showType==3
              }]
            },
            // {
            //   icon:'',
            //   sortable:true,
            //   label: '互联网售票机数据',
            //   // collapse:false,
            //   width:600,
            //   span:24,
            //   prop: 'group2',
            //   column: [{
            //     label: '',
            //     prop: 'listoption1',
            //     formslot:true,
            //   }
            //   ]
            // },
          ]
        } ;
        this.listoption1=listoption1();
        this.isReload=false;
        this.$nextTick(()=>{
          this.isReload=true;
        })
      },
      // async getSheBei(){
      //   let res=[];
      //   await getSwPmDeviceOperationCodeList({lineCode:this.formData.lineCode,stationCode:this.formData.stationCode}).then(r=>{
      //     res=r.data.data;
      //   });
      //   this.operationCodes=res;
      //   return res;
      // },

      changeLine(v){ //改变线路时
        this.formData.equipmentCode = '';
        getgetStationCodes(v).then(res=>{
          this.stationCodes=res;
        })
      },
      changeStation(v){
        this.formData.equipmentCode = '';
        this.getSheBei();
      },
      getSheBei(){
          getSwPmInternetTicketEquipmentCodeList({lineCode:this.formData.lineCode,stationCode:this.formData.stationCode}).then(r=>{
            this.equipmentNumbers=r.data.data;
        });
      },
    },
    mounted() {
      getLineCodes().then(res=>{ //获取线路
        this.lineCodes=res;
      });
    }
  }
</script>
<style lang="scss">
  .huLianWangShouPiaojiDataInput.EditorOrAdd{
    .avue-group[index='2']{
      .avue-form__group{
        .avue-form__row{
          width: 100%;
        }
      }
    }
    @media only screen and (min-width: 992px){
      width: 100%;
    }
    .avue-crud__tip{
      display: none;
    }
  }

</style>
